<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form class="form-horizontal" role="form" id="fmid">
    <input th:value="${v.optionList}"  type="hidden" id="id1" >
    <div class="form-group">
        <label class="col-sm-2 control-label">规格名称</label>
        <div class="col-sm-10">
            <input th:value="${v.specification.specName}" type="text" class="form-control" id="specName" name="specName">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-12">
            <button type="button" class="btn btn-default" onclick="addbook()" >新增规格选项 </button>
            <table class="col-sm-12" id="tab">
                <tr>
                    <td class="col-sm-4">规格选项</td>
                    <td class="col-sm-4">排序</td>
                    <td class="col-sm-4">操作</td>
                </tr>

                <tbody id="cptbody">
                </tbody>

            </table>
        </div>
    </div>
</form>


<script>




    //增加
    function addbook(){
        var row=$("<tr>\n" +
            "    <td> <input type='text' class='form-control'  name='optionName' placeholder='规格选项'></td>\n" +
            "        <td> <input type='text' class='form-control'  name='orders' placeholder='规格选项'></td>\n" +
            "        <td> <button type='button' class='btn btn-default' onclick='deleterow(this)' ><i class='fa fa-file-o'></i>删除</button></td>\n" +
            "    </tr>")
        var tobdy= $("#cptbody")
        row.appendTo(tobdy)
    }

    //删除
    function deleterow(cc){
        var table = cc.parentNode.parentNode.parentNode;
        var td=cc.parentNode.parentNode;
        table.removeChild(td);
    }


    // $(function (){
    //     // var opcation=$("#id1").val()
    //     // alert(a)  value='"+opcation[i].optionName+"'    th:value='"+opcation[i].optionName+"'
    //     console.log(opcation)
    //     var html="";
    //     alert(opcation.length)
        for(var i=0;i<opcation.length;i++){
            html+="<tr>\n" +
                "    <td> <input type='text' class='form-control'  value='"+opcation[i].optionName+"'    name='optionName' placeholder='规格选项'></td>\n" +
                "        <td> <input type='text' class='form-control' value='"+opcation[i].orders+"'    name='orders' placeholder='规格选项'></td>\n" +
                "        <td> <button type='button' class='btn btn-default' onclick='deleterow(this)' ><i class='fa fa-file-o'></i>删除</button></td>\n" +
                "    </tr>"

        }
        $("#cptbody").html(html)
    // })


</script>



</body>
</html>